<template>
	<view>
		<uni-popup ref="popup" type="center">
			<view class="">
				<view v-if="type==3" class="" style="height: 40vh;">
					
				</view>
				<view class="wrap" :class="model=='light'?'wrapLight':''">
					<view class="title A-Medium py-3 text-alignC">
						{{title}}!
					</view>
					<view class="content flex justify-center A-Medium px-3 pb-2">
						<view class="">
							{{content}}
						</view>
					</view>
					<view class="btnWrap flex align-center">
						<view @click="closePopup" class="title flex-1 flex align-center justify-center">
							{{calcen}}
						</view>
						<view class="bar">
							
						</view>
						<view @click="confirms" class="title flex-1 flex align-center justify-center">
							{{confirm}}
						</view>
					</view>
				</view>
			</view>
		</uni-popup>
	</view>
</template>

<script>
	export default {
		name: "modelP",
		props:{
			type:{
				type:Number,
				default:1,//1删除地址 2退出登录 3确认操作 4注销账号
			},
		},
		data() {
			return {
				title:'',
				content:"",
				calcen:'',
				confirm:''
			};
		},
		created() {
			this.title = this.i18n.m001;
			this.calcen = this.i18n.m002;
			this.confirm = this.i18n.m003;
			if(this.type==1){
				this.content = this.i18n.m004;
			}
			if(this.type==2){
				this.content = this.i18n.m005;
			}
			if(this.type==3||this.type==4){
				this.content = this.i18n.m006;
			}
			setTimeout(res=>{
				
			},1000)
		},
		computed: {
			i18n() {
				return this.$t('modelP');
			},
			model() {
				return this.$store.state.config.model;
			}
		},
		methods:{
			confirms(){
				this.$emit('confirm');
				this.closePopup();
			},
			open() {
				this.$refs.popup.open('center');
			},
			closePopup() {
				this.$refs.popup.close();
			}
		}
	}
</script>

<style scoped lang="scss">
	.wrap {
		width: 556rpx;
		background: #16181C;
		border-radius: 24rpx;
		overflow: hidden;
		.title {
			font-size: 32rpx;
			color: #F7F7F7;
		}
		.content {
			font-size: 28rpx;
			color: #AAACB8;
		}
		.btnWrap {
			border-top: 2rpx solid #1F2128;
			.bar {
				height: 88rpx;
				width: 2rpx;
				background: #1F2128;
			}
		}
	}
	.wrapLight {
		background: #fff;
		.title {
			color: #0E0F11;
		}
		.content {
			color: #0E0F11;
		}
		.btnWrap {
			border-top: 2rpx solid #F4F4F4;
			.bar {
				background: #F4F4F4;
			}
		}
	}
</style>